import { store } from "@/store";
import { LANGUAGE_KEY, THEME_KEY } from "@/constants";
import { setStore, getStore } from "@/utils/storage";
import defaultSettings from "@/settings";

export const useAppStore = defineStore({
  id: "app",
  state: () => ({
    theme: getStore(THEME_KEY) || defaultSettings.theme,
    language: getStore(LANGUAGE_KEY) || defaultSettings.language
  }),
  actions: {
    setTheme(theme) {
      this.theme = theme;
      setStore(THEME_KEY, theme);
      if (this.theme === "dark") {
        document.documentElement.classList.add("dark");
      } else {
        document.documentElement.classList.remove("dark");
      }
    },
    setLanguage(language) {
      this.language = language;
      setStore(LANGUAGE_KEY, language);
    }
  }
});

export function useAppStoreHook() {
  return useAppStore(store);
}
